<%--
  Created by IntelliJ IDEA.
  User: fangxi
  Date: 2021/4/22
  Time: 16:30
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%
    String basePath = request.getScheme() + "://" +
            request.getServerName() + ":" + request.getServerPort() +
            request.getContextPath() + "/";
%>
<html>
<head>
    <title>Title</title>
    <base href="<%=basePath%>"/>
    <script type="text/javascript" src="js/jquery-3.4.1.js"></script>
    <script type="text/javascript">
        $(function () {
            loadStudentData();
            $("button").click(function () {
                loadStudentData();
            })
        })

        function loadStudentData() {
            $.ajax({
                url: "student/queryStudents.do",
                type: "get",
                dataType: "json",
                success: function (datas) {
                    //清除表格原有数据
                    $("#stuInfo").html("");
                    $.each(datas, function (i, data) {
                        $("#stuInfo").append("<tr>")
                            .append("<td>" + data.id + "</tr>")
                            .append("<td>" + data.name + "</tr>")
                            .append("<td>" + data.age + "</tr>")
                            .append("</tr>")

                    })
                }
            })
        }

    </script>
</head>
<body>
<table>
    <thead>
    <tr>
        <td>学号</td>
        <td>姓名</td>
        <td>年龄</td>
    </tr>
    </thead>
    <tbody id="stuInfo">
    </tbody>
    <button>查询</button>
</table>
</body>
</html>
